<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>酒店基础信息维护</title>
    <link href="/resources/hotel/css/style.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="/resources/hotel/js/jquery.js"></script>
    <style type="text/css" rel="stylesheet">
        #basicInfoForm input{

        }
    </style>
    <script type="text/javascript">
        $(document).ready(function(){
            $(".click").click(function(){
                $(".tip").fadeIn(200);
            });

            $(".tiptop a").click(function(){
                $(".tip").fadeOut(200);
            });

            $(".sure").click(function(){
                $(".tip").fadeOut(100);
            });

            $(".cancel").click(function(){
                $(".tip").fadeOut(100);
            });

        });
    </script>


</head>


<body>

<div class="place">
    <span>位置：</span>
    <ul class="placeul">
        <li><a href="#">酒店信息管理</a></li>
        <li><a href="#">基础信息维护</a></li>
    </ul>
</div>
<div style="position:absolute;width: 800px;height:600px;margin: 0 200px;border: #00a4ac 1px solid">
    <form id="basicInfoForm">
        <div class="rightinfo">
            <div class="formtitle"><span>基本信息</span></div>
            <div style="position: absolute;left: 520px;">
                <h3>酒店缩略图：</h3>
                <input type="file" id="imageInput" style="margin-top: 20px;">
                <div style="height: 150px;width: 120px;margin-top: 20px;border: #00a4ac 1px solid;" id="imageDiv"></div>
            </div>
            <ul class="forminfo">
                <li>
                    <label style="font-size: 16px;">酒店名称：</label>
                    <input name="hName" type="text" class="dfinput" id="hName"/>
                    <i style="display: none;">名称不能超过30个字符</i>
                </li>
                <li><label style="font-size: 16px;">酒店地址：</label><input name="hAddr" id="hAddr" type="text" class="dfinput" /></li>
                <li><label style="font-size: 16px;">联系方式：</label><input name="hTel" id="hTel" type="text" class="dfinput" /></li>
                <li><label style="font-size: 16px;">收款账号：</label><input name="hPayee" id="hPayee" type="text" class="dfinput" /></li>
                <li>
                    <label style="font-size: 16px;width: 150px;">酒店最低入住价格：</label>
                    <input name="hMinPrice" id="hMinPrice" type="text" style="border:solid 1px silver;position: absolute;width: 70px;height: 30px;font-size: 16px;margin-top: 2px;"/>
                    <label style="font-size: 16px;margin-left: 100px;">元</label>
                </li>
                <li>
                    <label style="font-size: 16px;">酒店状态：</label>
                    <select style="font-size: 16px;margin-top: 8px;" name="hStatus" id="hStatus">
                        <option value="1">营业中</option>
                        <option value="0">打烊了</option>
                    </select>
                </li>
                <li><label style="font-size: 16px;">酒店描述</label><textarea name="hDesc" id="hDesc" cols="" rows="" class="textinput" style="margin-top: 10px;"></textarea></li>
                <li>
                    <label>&nbsp;</label>
                    <label class="click" style="margin-left: 100px;"><input name="" type="button" class="btn" value="确认保存"/></label>
                </li>
            </ul>
        </div>
    </form>
        <div class="tip" style="height: 300px;">
            <div class="tiptop"><span>提示信息</span><a></a></div>
            <div class="tipinfo">
                <span><img src="/resources/hotel/images/ticon.png" /></span>
                <div class="tipright">
                    <p>是否确认对信息的修改 ？</p>
                    <cite>如果是请点击确定按钮 ，否则请点取消。</cite>
                </div>
            </div>

            <div class="tipbtn" style="position: absolute;top:-220px;">
                <input name="" type="button"  class="sure" value="确定" id="save"/>&nbsp;
                <input name="" type="button"  class="cancel" value="取消" />
            </div>

        </div>
    </div>
</div>
<script type="text/javascript">
    $('.tablelist tbody tr:odd').addClass('odd');
</script>
<script type="text/javascript" src="/resources/hotel/js/imagePreview.js"></script>
<script type="text/javascript">
    var select = $("#imageInput");
    var div = $("#imageDiv");
    //图片预览的方法
    imagePreview(select,div,120,150);
</script>
<script>
    var hId;
    var hProfile;
    var hName = $("#hName");//酒店名称
    var hAddr = $("#hAddr");//地址
    var hTel = $("#hTel");//联系电话
    var hPayee = $("#hPayee");//收款账号
    var hMinPrice = $("#hMinPrice");//最低入住价格
    var hDesc = $("#hDesc");//酒店描述
    var hStatus = $("#hStatus");//酒店状态
    //获取酒店基本信息
    $.ajax({
        type:"post",
        url:"http://localhost:8080/hotelController/queryHotelByName",
        success:function (data) {
            if(data != null && data != ""){
                hProfile = data.hProfile;
                hId = data.hId;
                hName.val(data.hName);
                hAddr.val(data.hAddr);
                hTel.val(data.hTel);
                hPayee.val(data.hPayee);
                hMinPrice.val(data.hMinPrice);
                hDesc.val(data.hDesc);
                if(data.hStatus==1){
                    var option = "<option value='1'>营业中</option><option value='0'>打烊了</option>";
                    hStatus.html(option);
                }else {
                    var option = "<option value='0'>打烊了</option><option value='1'>营业中</option>";
                    hStatus.html(option);
                }
                $("#imageDiv").html("<img id='smallImage' style='width: 120px;height: 150px;' src='/"+data.hProfile+"'/>");
            }else {
                console.log("没有从后台获取到酒店详细信息!data:"+data);
            }
        },
        error:function () {
            alert("访问错误！");
        }
    });
    //修改酒店基本信息的请求
    $("#save").click(function () {
        var formData = new FormData();
        //获取文本信息
        var hotelStr={} ;
        hotelStr.hId =hId;
        hotelStr.hName=hName.val();
        hotelStr.hAddr=hAddr.val();
        hotelStr.hTel=hTel.val();
        hotelStr.hPayee=hPayee.val();
        hotelStr.hMinPrice=hMinPrice.val();
        hotelStr.hDesc=hDesc.val();
        formData.append("hotelStr", JSON.stringify(hotelStr));
        //获取轮播图信息
        var img = $("#imageInput").get(0).files[0];
        formData.append("swiperImg",img);

        $.ajax({
            url: "http://localhost:8080/hotelController/updateHotelInfo",
            type: "POST",
            data: formData,
            contentType: false,
            processData: false,
            cache: false,
            success: function (data) {
                if (data.success) {
                    alert("请求成功")
                } else {
                    alert("返回错误");
                }
            },
            error: function () {
                alert("访问错误！");
            }
        });
    });
</script>
</body>
</html>
